<template>
    <div>
<!--        default-active="user" 默认激活索引为“user”的菜单-->
        <el-menu
                style="width: 200px; min-height: calc(100vh - 50px)"
                :default-active="path"
                router
                class="el-menu-vertical-demo"
                @open="handleOpen"
                @close="handleClose"
        >
            <el-sub-menu index="1" v-if="user.role === 1">
                <template #title>
                    <el-icon><location /></el-icon>
                    <span>系统管理</span>
                </template>
                <el-menu-item index="/user">
                    <el-icon><Avatar /></el-icon>
                    用户管理
                </el-menu-item>
            </el-sub-menu>

            <el-menu-item index="/book">
                <el-icon><Folder /></el-icon>
                书籍管理
            </el-menu-item>

            <el-menu-item index="/news">
                <el-icon><Folder /></el-icon>
                新闻管理
            </el-menu-item>
        </el-menu>
    </div>
</template>

<script>
    import request from "../utils/request";

    export default {
        name: "Aside",
        data() {
            return {
                user: {},
                path: this.$route.path  //设置默认打开（高亮）的菜单
            }
        },
        created() {
            let userStr = sessionStorage.getItem("user") || "{}"
            this.user = JSON.parse(userStr)

            //请求服务端，确认当前登录用户的合法信息
            request.get("/user/" + this.user.id).then(res => {
                if (res.code === '0'){
                    this.user = res.data
                }
            })
        }
    }
    const handleOpen = {

    }
    const handleClose = {

    }
</script>

<style scoped>

</style>